import { resolve } from 'node:path'
import { fileURLToPath, URL } from 'node:url'

import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
import UnoCSS from 'unocss/vite'
import AutoImport from 'unplugin-auto-import/vite'
import { FileSystemIconLoader } from 'unplugin-icons/loaders'
import IconsResolver from 'unplugin-icons/resolver'
import Icons from 'unplugin-icons/vite'
import { ArcoResolver } from 'unplugin-vue-components/resolvers'
import Components from 'unplugin-vue-components/vite'
import { defineConfig } from 'vite'
// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue({ script: { defineModel: true } }),
    vueJsx(),
    UnoCSS(),
    AutoImport({
      vueTemplate: true,
      imports: ['vue', 'pinia', 'vue-router'],
      dirs: [
        resolve(__dirname, './src/config'),
        resolve(__dirname, './src/utils'),
        resolve(__dirname, './src/hooks'),
        resolve(__dirname, './src/stores/modules')
      ],
      dts: resolve(__dirname, './typings/auto-imports.d.ts'),
      resolvers: [ArcoResolver({ importStyle: false })]
    }),
    Icons({
      autoInstall: true,
      compiler: 'vue3',
      jsx: 'react',
      customCollections: {
        app: FileSystemIconLoader('src/assets/svgs'),
        ca: FileSystemIconLoader(
          'src/assets/images/main-parts/core-advantages'
        ),
        pf: FileSystemIconLoader(
          'src/assets/images/main-parts/product-features'
        ),
        pi: FileSystemIconLoader(
          'src/assets/images/main-parts/package-introduction'
        ),
        fs: FileSystemIconLoader('src/assets/images/footer-slogan'),
        fb: FileSystemIconLoader('src/assets/images/footer-bar'),
        hb: FileSystemIconLoader('src/assets/images/header-bar'),
        as: FileSystemIconLoader('src/assets/images/app-scene'),
        cf: FileSystemIconLoader('src/assets/images/contact-float')
      }
    }),
    Components({
      dirs: [resolve(__dirname, './src/components')],
      dts: resolve(__dirname, './typings/components.d.ts'),
      resolvers: [
        ArcoResolver({ importStyle: false, sideEffect: true }),
        IconsResolver({
          customCollections: [
            'app',
            'ca',
            'pf',
            'pi',
            'fs',
            'fb',
            'hb',
            'as',
            'cf'
          ]
        })
      ]
    })
  ],
  server: { host: true, port: 3000 },
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  }
})
